@extends('layout.art')
@section('content')
<a  class="btn btn-info" id="backIndex" style="display:none;width:60px;">返回</a>
<div class="container-fluid" id="addHtml" style="display:block;">
	<a class="btn btn-primary" id="addFile">添加文章</a>
	 
	<div id="replace">
 	 @foreach($res as $val)
		<div class="panel panel-default">
   
  			<div class="panel-body">

	  			<span id="titleW">{!! $val->title !!}</span>
	    		<a class="btn btn-info" id="read{{$val->id}}" >阅读</a>
	   			<a href="new/{{$val->id}}/edit" class="btn btn-info">修改</a>
		
	      		<form action="new/{{$val->id}}" method="post" style="display: inline-block;">
	          		  {{csrf_field()}}
	           		 {{method_field('DELETE')}}
	            	<button type="submit" class="btn btn-danger" id="del">删除</button>
	        	</form>
    		</div>
    		
    	</div>
    	<script type='text/javascript' src="/js/jquery-1.8.2.min.js"></script>
    	<script>
    	//显示显示页面
			$("#read{{$val->id}}").click(function(){
					$('#addHtml').css('display','none');
					//ajax设置
					$.get("new/{{$val->id}}",{},function(data){				
 						$('#showWeb').html(data);
 						$('#backIndex').css('display','block');
					}) 
				}); 

			//返回主页面
			 $("#backIndex").click(function(){
					$('#showWeb').empty();
					$('#backIndex').css('display','none');
					$('#addHtml').css('display','block')
				 })
				
			//删除单条信息
			$("#del").on('click',function(){
				
				})
    	</script>
    @endforeach
    </div>
 	{!! $res->render()  !!}
</div>
<div id="showWeb"></div>
<!-- ------------显示添加页面---------------- -->

 <div class="container-fluid" id="indexHtml" style="display:none;">
	 <a class="btn btn-info" id = "backOld">返回</a>
		  <form class="form-horizontal" method="post">
		        <input type="hidden" name="_token" value="<?php echo csrf_token(); ?>">
		  		<div class="form-group">
		   			<label for="inputEmail3" class="col-sm-2 control-label">标题</label>
		  			<div class="col-sm-8">
		     			<input type="title" class="form-control" id="title" name="title">
		     			<p id="look"></p>
		    		</div>
		  		</div>
		
		
		 		<div class="form-group">
		    		<label for="inputEmail3" class="col-sm-2 control-label">内容</label>
		    		<div class="col-sm-8">
		      		<!--  <textarea class="form-control" rows="5" id="content" name="content"></textarea> -->
			     	 	
			     		 <!-- 加载编辑器的容器 -->			     		 
					    	<script id="myedit" name="content" type="text/plain">
       							
    						</script>
    				
    					<!-- 实例化编辑器 -->
			     		<script type="text/javascript" >
			     		 		var ue = UE.getEditor('myedit',{
			     		 			
			     		 			toolbars: [
				     		 			  
				     		 			         [
				     		 			             'anchor', //锚点
				     		 			             'undo', //撤销
				     		 			             'redo', //重做
				     		 			             'bold', //加粗
				     		 			             'indent', //首行缩进
				     		 			             'snapscreen', //截图
				     		 			             'italic', //斜体
				     		 			             'underline', //下划线
				     		 			             'strikethrough', //删除线
				     		 			             'subscript', //下标
				     		 			             'fontborder', //字符边框
				     		 			             'superscript', //上标
				     		 			            'formatmatch', //格式刷
				     		 			             'blockquote', //引用
					     		 			         'simpleupload', //单图上传
						     		 			     'insertimage', //多图上传
				     		 			             'pasteplain', //纯文本粘贴模式
				     		 			             'selectall', //全选
					     		 			          'music', //音乐
						     		 			      'inserttable', //插入表格
							     		 			  'drafts', // 从草稿箱加载
							     		 			  'charts', // 图表
								     		 		  'map', //Baidu地图
							     		 	          'gmap', //Google地图
				     		 			             ]
			     		 			             ],
				     		 			 autoHeight: false,
		     		 			         autoFloatEnabled: true
									});
			     		 		
			     		</script>
		     		</div>
		 		</div> 
	
		  
		 	<div class="form-group">
		    	<div class="col-sm-offset-2 col-sm-10">
		     			<button type="button" class="btn btn-default" id="buttonCreate" >创建</button>
		    	</div>
		  	</div>
		</form>
	</div>
    	<script type='text/javascript' src="/js/jquery-1.8.2.min.js"></script>
		<script>
			//添加页面显示
				
				$("#addFile").click(function(){
					$('#addHtml').css('display','none');
					$('#indexHtml').css('display','block')
					});
				$('#title').val()
				//添加操作
				$('#buttonCreate').on("click",function(){
					var len = $('#title').val().length;
					if(len <1){
							alert('标题不能为空');
							return false;
						}else{
							if(len>20){
							alert('标题不能大于20个字符');
							return false;
							}
						}
					//设置变量值
					var title = $('#title').val();
					var content = UE.getEditor('myedit').getContent();
	
					/* 设置全局 ajax默认选项  */
			  		$.ajaxSetup({
			  			headers: { 'X-CSRF-TOKEN' : '{{ csrf_token() }}' },
			  	    });
					//ajax设置
					$.post('new/store',{'title':title,'content':content},function(data){
						$('#addHtml').css('display','block');
						$('#indexHtml').css('display','none')
						$('#replace').html(data); 
						
						}) 
					});

				//返回上一页面
				$('#backOld').click(function(){
						$('#addHtml').css('display','block');
						$('#indexHtml').css('display','none');
					});
		</script>

@endsection




